$(function () {

    var datagrid =  $("#datagrid");
    var dialog = $("#dialog");
    var class_dialog = $("#class_dialog");
    var class_datagrid = $("#class_datagrid");
    
    //给 a链接统一绑定事件
    $("a[data-cmd]").click(function(){
        var methodName = $(this).data("cmd");
        //调用方法
        methodObj[methodName]();
    });

    datagrid.datagrid({
        url: '/classroom/query.do',
        fit: true,
        fitColumns: true,
        columns: [[
            {field: 'name', title: '教室名称', width: 80},
            {field: 'address', title: '教室地址', width: 80},
            {field: 'seating', title: '教室座位', width: 80},
            {
                field: 'state',
                title: '状态',
                width: 80,
                formatter: function (value) {
                    return value ? '启用中' : '<span style="color: darkred">禁用了</span>'
                }
            },
            {field: 'sn', title: '教室标语', width: 80},
        ]],
        toolbar: '#toolbar',
        singleSelect: true,
        rownumbers: true,
        pagination: true,
        onSelect: function (index, data) {
            //判断员工的状态来显示按钮文字
            if (data.state) {
                $("#state_btn").linkbutton({
                    text: '禁用'
                })
            } else {
                $("#state_btn").linkbutton({
                    text: '启用'
                })
            }
            var row = datagrid.datagrid('getSelected');
            $.get('/grade/selectByClassroomId.do',{id: row.id},function (data) {
                if(data.success){
                    $("#state_btn").linkbutton({
                        disabled: true
                    })
                }else{
                    $("#state_btn").linkbutton({
                        disabled: false
                    })
                }
            })

            if (!data.state) {

                //移除data-cmd属性,同时增加disable方法禁用按钮
                $("a[data-cmd='edit']").data("cmd", "");
                $("a[data-cmd='edit']").linkbutton("disable");

                //同上,禁止查看
                $("a[data-cmd='watch']").data("cmd", "");
                $("a[data-cmd='watch']").linkbutton("disable");
            } else {

                //启用编辑
                $("a[data-cmd='edit']").data("cmd", "edit");
                $("a[data-cmd='edit']").linkbutton("enable");
                //启用查看
                $("a[data-cmd='watch']").data("cmd", "watch");
                $("a[data-cmd='watch']").linkbutton("enable");
            }
        }
    });

    dialog.dialog({
        width: 400,
        height: 300,
        closed: true,
        resizable: false,
        buttons: [
            {
                text: '保存',
                iconCls: 'icon-save',
                handler: function () {
                    methodObj.save();
                }
            },
            {
                text: '取消',
                iconCls: 'icon-cancel',
                handler: function () {
                    methodObj.cancel();
                }
            }
        ],
        //清空表单数据
        onClose: function () {
            $("#dept_form").form('clear');
        }
    });

    class_dialog.dialog({
        width: 800,
        height: 150,
        closed: true,
        title: "当前教室使用班级信息",
        buttons: "#class_btns"
    });


    //使用一个对象来统一管理实践的方法
    var methodObj = {
        add: function () {
            //弹出表格窗口
            dialog.dialog("open")

            //设置标题
            dialog.dialog('setTitle', '新增教室');
        },

        edit: function () {
            //判断是否选中了数据
            var row = datagrid.datagrid('getSelected');
            if (!row) {
                //如果没有选中 提示框提示信息
                $.messager.alert("温馨提示", "请选中一条数据", "warning");
                return;
            }

            //选中了一条数据 回显表单数据(根据同名匹配原则 row对象中的属性名要与form中name相同才可以回显)
            $("#form").form('load', row);

            //弹出表格窗口
            dialog.dialog("open");

            //设置标题
            dialog.dialog('setTitle', '编辑教室');
        },

        //改变教室是否启用的的状态
        changeState: function () {
            var row = datagrid.datagrid('getSelected');
            if (!row) {
                //如果没有选中 提示框提示信息
                $.messager.alert("温馨提示", "请选中一条数据", "warning");
                return;
            }
            //弹出确认框 确认改变状态
            $.messager.confirm('确认', '确认要改变该教室的状态', function (r) {
                if (r) {
                    //发送请求到后台
                    $.get("/classroom/changeState.do", {id: row.id}, function (data) {
                        console.log(data.success);
                        if (data.success) {
                            $.messager.alert('温馨提示', '改变成功', 'info', function () {
                                //刷新当前页面
                                datagrid.datagrid('reload');
                            });
                        } else {

                            $.messager.alert('温馨提示', data.msg, 'error');
                        }
                    })
                }
            })
        },

        //查看操作
        watch: function () {
            var room = datagrid.datagrid('getSelected');
            if (!room){
                $.messager.alert("温馨提示","请选择一条记录查看","info");
                return;
            }
               var roomId = room.id;
            class_datagrid.datagrid({
                fit:true,
                fitColumns:true,
                url:"/grade/selectByRoomId.do?roomId="+roomId,
                columns: [[
                    {field: 'id', title: '班级编号', width: 50, align: 'center'},
                    {field: 'className', title: '班级名称', width: 100, align: 'center'},
                    {field: 'studentNum', title: '学生数量', width: 100, align: 'center'},
                    {
                        field: 'college',
                        title: '所在学院',
                        width: 100,
                        align: 'center',
                        formatter: function (value) {
                            return value ? value.name : "<font style='color: red'>尚未分配学院</font>";
                        }
                    },
                    {
                        field: 'state',
                        title: '班级状态',
                        width: 100,
                        align: 'center',
                        formatter: function (value, row, index) {
                            if (value) {
                                return "已开班";
                            } else {
                                return "<font style='color: red'>未开班</font>";
                            }
                        }
                    },
                    {
                        field: 'classroomName',
                        title: '所在教室',
                        width: 100,
                        align: 'center',
                        formatter: function (value, row, index) {
                            return value ? value.name : "<font style='color: red'>尚未分配教室</font>";
                        }
                    },
                    {
                        field: 'teacher',
                        title: '班主任',
                        width: 100,
                        align: 'center',
                        formatter: function (value, row, index) {
                            return value ? value.realname : "<font style='color: red'>尚未分配班主任</font>";
                        }
                    }
                ]],
                onLoadSuccess: function (data) {
                    if (data.total == 0) {
                        $.messager.alert("温馨提示", "当前教室尚未分配班级!", "info");
                        return;
                    }
                    //显示dialog
                    class_dialog.dialog("open");
                }
            });
        },
        ensure: function () {//关闭显示教室信息弹出框
        class_dialog.dialog("close");
    },



        //保存操作
        save: function () {
            $("#form").form('submit', {
                url: '/classroom/saveOrUpdate.do',
                success: function (data) {
                    //转换为json对象
                    data = $.parseJSON(data);
                    if (data.success) {
                        //提示用户操作结果
                        $.messager.alert('温馨提示', '保存成功!', 'info', function () {
                            //关闭弹出框
                            methodObj.cancel();
                            // load 加载和显示第一页的所有行
                            datagrid.datagrid('reload')
                        })
                    } else {
                        $.messager.alert('温馨提示', data.msg, 'error')
                    }
                }
            })
        },

        //取消操作
        cancel: function () {
            dialog.dialog('close');
        }
    }
});

//注意,searchbox指定的search方法不能抽到method中管理
function search(value) {
    $("#datagrid").datagrid("load", {
        keyword: value
    });
}